<%--
  Created by IntelliJ IDEA.
  User: 庄兴宇
  Date: 2020/6/15
  Time: 14:03
  To change this template use File | Settings | File Templates.
--%>


<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<%@ taglib uri="http://java.sun.com/jstl/core_rt" prefix="c" %>
<%@ taglib uri="http://java.sun.com/jsp/jstl/fmt" prefix="fmt" %>
<!DOCTYPE html>
<html>
<head>
    <!-- Meta-Information -->
    <title>Zawya Admin Panel</title>
    <meta charset="utf-8">
    <meta name="description" content="">
    <meta name="viewport" content="width=device-width, initial-scale=1">

    <!-- Vendor: Bootstrap 4 Stylesheets  -->
    <link rel="stylesheet" href="css/jquery-ui.min.css">
    <link rel="stylesheet" href="css/bootstrap.min.css" type="text/css">

    <!-- Our Website CSS Styles -->
    <link rel="stylesheet" href="css/icons.min.css" type="text/css">
    <link rel="stylesheet" href="css/main.css" type="text/css">
    <link rel="stylesheet" href="css/responsive.css" type="text/css">

    <!-- Color Scheme -->
    <link rel="stylesheet" href="css/color-schemes/color.css" type="text/css" title="color3">
    <link rel="alternate stylesheet" href="css/color-schemes/color1.css" title="color1">
    <link rel="alternate stylesheet" href="css/color-schemes/color2.css" title="color2">
    <link rel="alternate stylesheet" href="css/color-schemes/color4.css" title="color4">
    <link rel="alternate stylesheet" href="css/color-schemes/color5.css" title="color5">

    <%--    edit by fjh--%>
    <%--    样式微调--%>
    <style>
        .search-input{
            background-color: #f7f7f7;
            color: #444444;
            float: left;
            font-size: 13px;
            height: 50px;
            letter-spacing: 0;
            padding: 10px 50px 10px 30px;
            width: 100%;
        }
        .search-btn{
            background-color: transparent;
            bottom: 0;
            color: #444444;
            font-size: 13px;
            position: absolute;
            right: 0;
            top: 0;
            width: 60px;
        }
    </style>
</head>
<body class="expand-data panel-data">
<!-- 内容区域 -->
<div class="content-wrapper">

    <!-- 内容头部 -->
    <section class="content-header">
        <h1>
            订单管理 <small>订单表单</small>
        </h1>
        <ol class="breadcrumb">
            <li><a href="${pageContext.request.contextPath}/index.jsp"><i
                    class="fa fa-dashboard"></i> 首页</a></li>
        </ol>
    </section>
    <!-- 内容头部 /-->

    <form action="${pageContext.request.contextPath}/goodsCate.save"
          method="post">
        <!-- 正文区域 -->
        <section class="content"> <!--订单信息-->

            <div class="panel panel-default">
                <div class="panel-heading">订单信息</div>
                <div class="row data-type">

                    <div class="col-md-2 title">订单ID</div>
                    <div class="col-md-4 data">
                        <input type="text" class="form-control" name="id"
                               placeholder="订单ID" value="">
                    </div>
                    <div class="col-md-2 title">客人ID</div>
                    <div class="col-md-4 data">
                        <input type="text" class="form-control" name="guestId"
                               placeholder="客人ID" value="">
                    </div>

                    <div class="col-md-2 title">员工ID</div>
                    <div class="col-md-4 data">
                        <input type="text" class="form-control" name="staffId"
                               placeholder="员工ID" value="">
                    </div>

                    <div class="col-md-2 title">添加时间</div>
                    <div class="col-md-4 data">
                        <input type="text" class="form-control" placeholder="添加时间"
                               name="addTime" value="">
                    </div>

                    <div class="col-md-2 title">支付状态</div>
                    <div class="col-md-4 data">
                        <select class="form-control select2" style="width: 100%"
                                name="isPaid">
                            <option value="0" selected="selected">未支付</option>
                            <option value="1">已支付</option>
                        </select>
                    </div>
                    <div class="col-md-2 title">订单总价</div>
                    <div class="col-md-4 data">
                        <input type="text" class="form-control" name="total"
                               placeholder="订单总价" value="">
                    </div>

                </div>
            </div>
            <!--订单信息/--> <!--工具栏-->
            <div class="box-tools text-center">
                <button type="submit" class="btn bg-maroon">保存</button>
                <button type="button" class="btn bg-default"
                        onclick="history.back(-1);">返回</button>
            </div>
            <!--工具栏/--> </section>
        <!-- 正文区域 /-->
    </form>
</div>
<!-- 内容区域 /-->

<header class="side-header light-skin expand-header">
    <div class="nav-head">主菜单<span class="menu-trigger"><i class="ion-android-menu"></i></span></div>
    <nav class="custom-scrollbar">
        <ul class="drp-sec">
            <li class="has-drp"><a href="#" title=""><i class="ion-home"></i> <span>房间占用查询</span></a>
                <ul class="sb-drp">
                    <li><a href="/hotelsystem/searchOccupyRoom" title="">查询</a></li>
                </ul>
            </li>
        </ul>
        <ul class="drp-sec">
            <li class="has-drp"><a href="#" title=""><i class="ion-home"></i> <span>客房账单管理</span></a>
                <ul class="sb-drp">
                    <li><a href="/hotelsystem/roomBillPage" title="">客房账单</a></li>
                </ul>
            </li>
        </ul>
        <ul class="drp-sec">
            <li class="has-drp"><a href="#" title=""><i class="ion-android-contact"></i> <span>入住服务</span></a>
                <ul class="sb-drp">
                    <li><a href="/hotelsystem/addStayBusiness" title="">登记入住</a></li>
                </ul>
                <ul class="sb-drp">
                    <li><a href="/hotelsystem/stayBusinessPage" title="">住房服务管理</a></li>
                </ul>
            </li>
        </ul>
        <ul class="drp-sec">
            <li class="has-drp"><a href="#" title=""><i class="ion-fireball"></i> <span>预定服务</span></a>
                <ul class="sb-drp">
                    <li><a href="/hotelsystem/addRoomBusiness" title="">预定客房</a></li>
                    <li><a href="/hotelsystem/roomBusinessPage" title="">预定业务管理</a></li>
                </ul>
            </li>
        </ul>
        <ul class="drp-sec">
            <li class="has-drp"><a href="#" title=""><i class="ion-fireball"></i> <span>房客管理</span></a>
                <ul class="sb-drp">
                    <li><a href="${pageContext.request.contextPath}/getGuestMain.action" title="">房客列表</a></li>
                </ul>
            </li>
        </ul>
        <ul class="drp-sec">
            <li class="has-drp"><a href="#" title=""><i class="ion-fireball"></i> <span>会员管理</span></a>
                <ul class="sb-drp">
                    <li><a href="${pageContext.request.contextPath}/getVipMain.action" title="">会员列表</a></li>

                </ul>
            </li>
        </ul>
        <ul class="drp-sec">
            <li class="has-drp"><a href="#" title=""><i class="ion-fireball"></i> <span>商品订单</span></a>
                <ul class="sb-drp">
                    <li><a href="${pageContext.request.contextPath}/goodsOrder.findAll?page=1&sie=4" title="">查看商品订单</a></li>
                </ul>
            </li>
        </ul>
    </nav>
</header><!-- Side Header -->

<div class="option-panel">
    <span class="panel-btn"><i class="fa ion-android-settings fa-spin"></i></span>
    <div class="color-panel">
        <h4>Text Color</h4>
        <span class="color1" onclick="setActiveStyleSheet('color1'); return false;"><i></i></span>
        <span class="color2" onclick="setActiveStyleSheet('color2'); return false;"><i></i></span>
        <span class="color3" onclick="setActiveStyleSheet('color'); return false;"><i></i></span>
        <span class="color4" onclick="setActiveStyleSheet('color4'); return false;"><i></i></span>
        <span class="color5" onclick="setActiveStyleSheet('color5'); return false;"><i></i></span>
    </div>
</div><!-- Options Panel -->
<%--<div class="pg-tp">--%>
<%--    <i class="ion-cube"></i>--%>
<%--    <div class="pr-tp-inr">--%>
<%--        <h4>Welcome to <strong>ZAWYA</strong><span></span> Panel</h4>--%>
<%--        <span>Admin Template for medium and large web applications with ery clean and aesthetic style.</span>--%>
<%--    </div>--%>
<%--</div><!-- Page Top -->--%>

<div class="panel-content">
    <div class="filter-items">
        <div class="row grid-wrap mrg20">


        </div><!-- Filter Items -->
    </div>
</div><!-- Panel Content -->


<footer>
    <p>Copyright <a href="http://www.bootstrapmb.com" title="">Example Company</a> &amp; 2017 - 2018</p>
    <span>10GB of 250GB Free.</span>
</footer>

<!-- Vendor: Javascripts -->
<script src="js/jquery.min.js" type="text/javascript"></script>
<!-- Vendor: Followed by our custom Javascripts -->
<script src="js/bootstrap.min.js" type="text/javascript"></script>
<script src="js/jquery-ui.min.js" type="text/javascript"></script>
<script src="js/select2.min.js" type="text/javascript"></script>
<script src="js/slick.min.js" type="text/javascript"></script>

<!-- Our Website Javascripts -->
<script src="js/isotope.min.js" type="text/javascript"></script>
<script src="js/isotope-int.js" type="text/javascript"></script>
<script src="js/jquery.counterup.js" type="text/javascript"></script>
<script src="js/waypoints.min.js" type="text/javascript"></script>
<script src="js/highcharts.js" type="text/javascript"></script>
<script src="js/exporting.js" type="text/javascript"></script>
<script src="js/highcharts-more.js" type="text/javascript"></script>
<script src="js/moment.min.js" type="text/javascript"></script>
<script src="js/jquery.circliful.min.js" type="text/javascript"></script>
<script src="js/fullcalendar.min.js" type="text/javascript"></script>
<script src="js/jquery.downCount.js" type="text/javascript"></script>
<script src="js/jquery.bootstrap-touchspin.min.js" type="text/javascript"></script>
<script src="js/jquery.formtowizard.js" type="text/javascript"></script>
<script src="js/form-validator.min.js" type="text/javascript"></script>
<script src="js/form-validator-lang-en.min.js" type="text/javascript"></script>
<script src="js/cropbox-min.js" type="text/javascript"></script>
<script src="js/jquery.slimscroll.min.js" type="text/javascript"></script>
<script src="js/ion.rangeSlider.min.js" type="text/javascript"></script>
<script src="js/jquery.poptrox.min.js" type="text/javascript"></script>
<script src="js/styleswitcher.js" type="text/javascript"></script>
<script src="js/main.js" type="text/javascript"></script>
<script type="text/javascript">
    $(document).ready(function () {
        'use strict';

        Highcharts.chart('chrt1', {
            colors: ['#dadada','#67ba5f'],
            chart: {
                type: 'area',
                backgroundColor: "#FFFFFF",
                borderColor: "#335cad"
            },
            legend: {
                enabled: false
            },
            title: {
                text: 'Active users in current month (December)',
                style: { "color": "#444444", "fontSize": "12px" }
            },
            xAxis: {
                categories: ['1', '2', '3', '4', '5', '6', '7']
            },
            credits: {
                enabled: false
            },
            tooltip: {
                pointFormat: '{series.name} produced <b>{point.y:,.0f}</b><br/>warheads in {point.x}'
            },
            plotOptions: {
                area: {
                    categories: ['1', '2', '3', '4', '5', '6', '7'],
                    marker: {
                        enabled: false,
                        symbol: 'circle',
                        radius: 2,
                        states: {
                            hover: {
                                enabled: true
                            }
                        }
                    }
                }
            },
            series: [{
                data: [18,45,35,10,85,25,90]
            }, {
                data: [45,50,25,85,55,65,70]
            }]
        });

        Highcharts.chart('chrt2', {
            colors: ['#dadada','#f89898'],
            chart: {
                type: 'area',
                backgroundColor: "#FFFFFF",
                borderColor: "#335cad"
            },
            legend: {
                enabled: false
            },
            title: {
                style: {
                    display: 'none'
                }
            },
            xAxis: {
                categories: ['1', '2', '3', '4', '5', '6', '7']
            },
            credits: {
                enabled: false
            },
            tooltip: {
                pointFormat: '{series.name} produced <b>{point.y:,.0f}</b><br/>warheads in {point.x}'
            },
            plotOptions: {
                area: {
                    categories: ['1', '2', '3', '4', '5', '6', '7'],
                    marker: {
                        enabled: false,
                        symbol: 'circle',
                        radius: 2,
                        states: {
                            hover: {
                                enabled: true
                            }
                        }
                    }
                }
            },
            series: [{
                data: [18,45,35,10,85,25,90]
            }, {
                data: [45,50,25,85,55,65,70]
            }]
        });

        $('a[data-toggle="tab"]').on('shown.bs.tab', function (e) {
            $('#chrt3').highcharts({
                colors: ['#dadada','#f89898'],
                chart: {
                    type: 'area',
                    backgroundColor: "#FFFFFF",
                    borderColor: "#335cad"
                },
                legend: {
                    enabled: false
                },
                title: {
                    style: {
                        display: 'none'
                    }
                },
                xAxis: {
                    categories: ['1', '2', '3', '4', '5', '6', '7']
                },
                credits: {
                    enabled: false
                },
                tooltip: {
                    pointFormat: '{series.name} produced <b>{point.y:,.0f}</b><br/>warheads in {point.x}'
                },
                plotOptions: {
                    area: {
                        categories: ['1', '2', '3', '4', '5', '6', '7'],
                        marker: {
                            enabled: false,
                            symbol: 'circle',
                            radius: 2,
                            states: {
                                hover: {
                                    enabled: true
                                }
                            }
                        }
                    }
                },
                series: [{
                    data: [18,45,35,10,85,25,90]
                }, {
                    data: [45,50,25,85,55,65,70]
                }]
            });
        });

        $('a[data-toggle="tab"]').on('shown.bs.tab', function (e) {
            $('#chrt4').highcharts({
                colors: ['#dadada','#f89898'],
                chart: {
                    type: 'area',
                    backgroundColor: "#FFFFFF",
                    borderColor: "#335cad"
                },
                legend: {
                    enabled: false
                },
                title: {
                    style: {
                        display: 'none'
                    }
                },
                xAxis: {
                    categories: ['1', '2', '3', '4', '5', '6', '7']
                },
                credits: {
                    enabled: false
                },
                tooltip: {
                    pointFormat: '{series.name} produced <b>{point.y:,.0f}</b><br/>warheads in {point.x}'
                },
                plotOptions: {
                    area: {
                        categories: ['1', '2', '3', '4', '5', '6', '7'],
                        marker: {
                            enabled: false,
                            symbol: 'circle',
                            radius: 2,
                            states: {
                                hover: {
                                    enabled: true
                                }
                            }
                        }
                    }
                },
                series: [{
                    data: [18,45,35,10,85,25,90]
                }, {
                    data: [45,50,25,85,55,65,70]
                }]
            });
        });

        Highcharts.chart('chart5', {
            colors: ['#fc4b6c', '#26c6da', '#1e88e5'],
            chart: {type: 'column'},
            xAxis: {
                categories: ['Jan', 'Feb', 'Mar', 'Apr', 'May', 'Jun', 'Jul', 'Aug', 'Sept', 'Oct', 'Nov', 'Dec']
            },
            title: {text: null},
            yAxis: {min: 0},
            tooltip: {
                pointFormat: '<span style="color:{series.color}">{series.name}</span>: <b>{point.y}</b> ({point.percentage:.0f}%)<br/>',
                shared: true
            },
            plotOptions: {
                column: {stacking: 'percent'}

            },
            legend: {
                align: 'right',
                verticalAlign: 'top',
                symbolRadius: 0,
                itemStyle: {
                    color: '#555555',
                    fontSize: '13px',
                    fontWeight: '300'
                },
            },
            series: [{
                name: '2017',
                data: [500, 750, 1000, 1250, 1500, 1750, 2000, 2250, 1700, 2100, 900, 800,]
            }, {
                name: '2016',
                data: [1500, 1750, 2000, 2250, 500, 750, 1000, 1250, 1700, 2100, 900, 800,]
            }, {
                name: '2015',
                data: [1700, 2100, 900, 800, 500, 750, 1000, 1250, 1500, 1750, 2000, 2250,]
            }]
        });

        //===== ToolTip =====//
        if ($.isFunction($.fn.tooltip)) {
            $('[data-toggle="tooltip"]').tooltip();
        }

        $('.grid-item').draggable();
    });
</script>
</body>
</html>